/**********************************************工作流相关start****************************************************************************/


<!--提交时选择审批人弹框 -->
<el-dialog title="审批人列表" :visible.sync="approvalUserDialogVisible" append-to-body width="65%" top="8vh">
  <component :is="componentName" :businessKey="businesskey" :jsResult="jsResult" :taskId="taskId"
             :taskKey="taskKey" :processDefinitionId="processDefinitionId" @getList="getList"
             ref="CustomPageRef">
  </component>

  <span slot="footer" class="dialog-footer">
        <el-button @click="closeApprovalUserDialog" size="mini">取消</el-button>
        <el-button v-for="(item, index) in jsResult" :key="index" @click="handleSubmitBtn(item.type)">
          {{ item.label }}
        </el-button>
      </span>
</el-dialog>





/*********************************工作流start***********************************************/
##########################index.vue
//提交
handleSubmit(row){
this.confirm(`是否确认提交该数据?`).then(() => {
this.businesskey = row.planid
//调用提交接口
submitRecheck({planid:row.planid}).then(res => {
if(res.code === 200) {
this.taskId = res.data.taskid
this.taskKey = res.data.taskkey
this.processInstanceId = res.data.processinstanceid
this.processDefinitionId =res.data.processdefinitionid
this.getTaskExt().then(() => {
let importUrl = 'rule/systemManage/recheck/submitDetail'
this.componentName = (resolve) => require([`@/views/$!{importUrl}`], resolve);
this.approvalUserDialogVisible = true;
})
}else{
this.getList()
this.msgError('提交失败！')
}
})
})
},
// 查询任务扩展属性
getTaskExt() {
let params = {
processDefinitionId: this.processDefinitionId,
taskKey: this.taskKey
}
return getTaskExt(this.addDateRange(params,null)).then(
(response) => {
let operationListJson = response.data.operationListJson
console.log("JSON:"+operationListJson)
this.jsResult = JSON.parse(operationListJson) || []
}
)
},
//处理按钮
handleSubmitBtn(type, businessKey) {
let flag = this.$refs.CustomPageRef.completeTask(this.taskId, this.processInstanceId, type)
console.log("flag:"+flag+",this.businesskey====>",this.businesskey);
if (flag) {
this.approvalUserDialogVisible = false
}
},
//关闭审批人弹框
closeApprovalUserDialog(){
this.approvalUserDialogVisible = false;
},
##########################detail




<!--审批意见输入框表单,如需要直接复制即可-->
<el-form :model="formComment" label-width="150px" :rules="rules" ref="formComment">
  <el-row>
    <el-col :span="24" v-if="taskKey != 'NODE3'">
      <el-form-item label="下一节点审批人" prop="nextPersonDisp" label-width="80px">
        <el-input placeholder="请选择下一节点审批人" show-word-limit v-model="formComment.nextPersonDisp"
                  @focus="handleListFocus()"/>
      </el-form-item>
    </el-col>

    <el-col :span="24" v-if="taskKey != 'NODE1'">
      <el-form-item label="审批意见" prop="comment" label-width="80px">
        <el-input type="textarea" maxlength="256" placeholder="请输入审批意见"
                  show-word-limit :rows="6"
                  v-model="formComment.comment"/>
      </el-form-item>
    </el-col>
  </el-row>
</el-form>


<!--下一审批审批人列表-->
<el-dialog title="选择下一节点审批人" :visible.sync="open" append-to-body>
  <approval-user ref="approvalUser" @setApprovelUserList="setApprovelUserList"
                 @closeDialog="closeApprovelUserDialog"></approval-user>
</el-dialog>



//根据当前节点获取下一节点信息
getnextTask() {
getBehindNodeInfoByTaskId(this.taskId).then(res => {
if (res.code === 200) {
if (res.data) {
res.data.forEach(item => {
if (item.conditionExpression.indexOf('agree') >= 0 || item.conditionExpression.indexOf('own_node') >= 0 || item.conditionExpression.indexOf('submit') >= 0) {//此处只获取提交方向的下一节点信息  
this.nextTaskId = item.targetRef
}
})
}
}
})
},

//选择下一节点审批人
handleListFocus() {
this.open = true
this.$nextTick(() => {
this.$refs.approvalUser.queryUserParams.processDefinitionId = this.processDefinitionId
this.$refs.approvalUser.queryUserParams.taskId = this.nextTaskId
this.$refs.approvalUser.getList()
})
},
//选择后,回显下一节点审批人
setApprovelUserList(data, names) {
console.log("回显下一节点审批人:"+""+data+","+names)
this.formComment.nextPerson = data
this.formComment.nextPersonDisp = names
},
// 关闭选人弹框
closeApprovelUserDialog() {//关闭下一节点审批人弹窗
this.open = false
},
//代办界面回调,点击审批按钮如提交，同意，退回时触发该方法,该方法大部分内容为固定写法，只需更改后台调用接口即可,参考:troubleshooting/..../flowMoudle.vue,陈美静代码
completeTask(taskId, processInstanceId, operationType) {
this.$refs['form'].validate((valid) => {
if (!valid) {
return
}
})
let closeType = true
this.$refs['formComment'].validate((valid) => {
if (valid) {
let body = {
businessKey: this.businessKey,//用于处理业务处理
processInstanceId: processInstanceId,
taskId: taskId,
taskKey: this.taskKey,
flowTaskComment: {
approvalType: operationType,
comment: this.formComment.comment
},
};

if (this.formComment.nextPersonDisp != null && this.formComment.nextPersonDisp != ''){
body.assigneeArr = this.formComment.nextPerson //下一节点审批人
}
// 完成任务
completeTaskRecheck(body).then((response) => {
if (response.code === 200) {
//刷新代办列表
this.$emit('getList')
this.msgSuccess(response.msg)
}
})
} else {
closeType = false
}
})
return closeType
},
/***************************************工作流相关end*************************************************/








handleSave() {
this.form.reason=this.form.reason.join(',')//数组的保存
const data = Object.assign({}, this.form)
}
getForm(data) {
const {compliantdesc, intactdesc, operatedesc, concertdesc, validesc,reason} = data
this.form.reason = reason ? reason.split(',') : []//数组的渲染
}


/**********************************************详情页面嵌套列表start****************************************************************************/
<template>
  <el-dialog :title="getTitle()" :visible.sync="visible" append-to-body width="70%" @close="closeDialog">
    <!-- 操作 按钮 -->
    <div class="operate-btn">
      <div class="btn-left">
        <custom-button content="关联内规" name="add" :disabled="selectedData.length > 0 ? false : true" placement="left" icon="el-icon-plus" @click.native="handleLinksData" />
      </div>
    </div>
    <!-- 列表 -->
    <el-table
            ref="mytable"
            v-loading="loading"
            border
            fit
            stripe
            height="50vh"
            :data="tableData"
            @row-click="rowClick"
            @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" align="center" />
      <template v-for="(item, index) in innerTableHeader">
        <el-table-column
                :key="item.prop + index"
                :prop="item.prop"
                :label="item.label"
                align="center"
                v-if="item.isShow"
                :width="item.width"
                :sortable="item.sortable"
                :min-width="item.minWidth"
                :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <div v-if="item.prop !== 'flowstatus' && item.prop !== 'timelinessid'">{{scope.row[item.prop]}}</div>
            <div v-else>{{statusFormat(item.prop, scope.row)}}</div>
          </template>
        </el-table-column>
      </template>
    </el-table>

    <div class="footer-div">
      <pagination
              :total="total"
              :page.sync="queryParams.pageNum"
              :limit.sync="queryParams.pageSize"
              @pagination="getList"
      />
    </div>
  </el-dialog>
</template>

<script>
  import {getRuleInnerNoList,addT21RuleRecheckMp} from '@/api/rule/recheck'
  export default {
    name: 'linkDislog',
    props: {
      show: {
        type: Boolean,
        default: false
      },
      linkType: {
        type: String
      },
    },
    data() {
      return {
        form: {},
        tableData: [],
        selectedData: [],
        innerTableHeader:[
          {
            label: '文件名称',
            prop: 'innername',
            align: 'center',
            sortable: true,
            isShow: true
          },
          {
            label: '发文文号',
            prop: 'fileno',
            align: 'center',
            sortable: true,
            isShow: true
          },
          {
            label: '发文日期',
            prop: 'dispatchdate',
            align: 'center',
            sortable: true,
            isShow: true
          },
          {
            label: '时效性',
            prop: 'timelinessid',
            align: 'center',
            sortable: true,
            isShow: true
          },

        ],//内规制度
        queryParams: {
          pageNum: 1,
          pageSize: this.$store.state.config.pageSize
        },
        total: 0,
        loading: false,
        ruleInnerStatus: [],
        ruleInnerTimeout: [],
        ruleInnerLevel: [],
        planid: '',

      }
    },
    computed: {
      visible: {
        get() {
          return this.show
        },
        set(val) {
          this.$emit('update:show', val)
        }
      },
      themesize() {
        return this.$store.state.settings.size
      }
    },
    created() {
      // 内规制度层级
      this.getDicts('rule_inner_level').then((response) => {
        this.ruleInnerLevel = response.data
      })
      this.getDicts('rule_inner_submit_status').then((response) => {
        this.ruleInnerStatus = response.data
      })
      // 内规时效性
      this.getDicts('rule_outer_timeout').then((response) => {
        this.ruleInnerTimeout = response.data
      })
      this.getList()
    },
    methods: {
      linkedData(val) {
        this.planid = val
        this.$nextTick(() => {
          this.getList()
        })
      },
      handleQuery() {
        this.getList()
      },
      resetQuery() {
        this.form = {}
        this.$refs.mytable.clearSort()
        this.queryParams = {
          pageNum: 1,
          pageSize: this.$store.state.config.pageSize
        },
                this.getList()
      },

      getTitle() {
        let title = '内规列表'
        return title
      },

      // 字段转码
      statusFormat(prop,row) {
        if(prop === 'timelinessid') return this.selectDictLabel(this.ruleInnerTimeout, row['timelinessid'])
      },

      // 获取数据
      getList() {
        const data = {planid: this.planid}
        getRuleInnerNoList(this.queryParams,data).then(res => {
          if(res.code === 200) {
            this.tableData = res.rows
            this.total = res.total
          }
        })
      },

      // 勾选的数据
      handleSelectionChange(selection) {
        this.selectionData = selection.map(item => item.innerid)
        this.selectedData = selection
      },

      // 单击选中当前行数据
      rowClick(row) {
        this.$refs.mytable.toggleRowSelection(row)
      },

      // 关联数据
      handleLinksData() {
        if(this.selectedData.length === 0) return this.$message({type: 'warning',message: '至少选择一条数据！'})
        const data = {
          ruleids: this.selectionData,
          ruletype: this.linkType,
          planid: this.planid
        }
        addT21RuleRecheckMp(data).then(res =>{
          if(res.code === 200) {
            this.msgSuccess('关联成功！')
            this.$emit('update:show', false)
            this.$emit('handleLinkSuccess',{type: this.linkType})
          }
        })
      },

      closeDialog() {
        this.selectedData = []
        this.$emit('update:show', false)
      },
    }
  }
</script>

<style scoped>

</style>





<!--------父组件--------------------->

<!--    重检制度列表-->
<el-divider content-position="left">重检制度列表</el-divider>
<el-card class="box-card">
  <!--<h5 class="titleName">重检制度列表</h5>-->
  <div class="operate-btn" v-if="dialogType !== 'check'">
    <div class="btn-left">
      <custom-button  content="新增" name="add" placement="left" icon="el-icon-plus" @click.native="handleLinkedData('2')" />
      <custom-button  content="评估" name="add" placement="left" icon="el-icon-plus" @click.native="handleLinkedData('2')" />

    </div>
  </div>

  <el-table :data="ruleList" border style="width: 100%">
    <el-table-column prop="rulename" label="文件名称" align="center" />
    <el-table-column prop="ruleno" label="发文文号" align="center" />
    <el-table-column prop="dispatchdate" label="成文日期" align="center" />
    <el-table-column prop="flowstatus"  label="状态"  align="center" />
    <el-table-column prop="address" label="操作" align="center" v-if="(dialogType !== 'check')">
      <template slot-scope="scope">
        <custom-button  content="取消关联" name="add" placement="left" icon="el-icon-plus" @click.native="handleDeleteLink('1',scope.row)" />
      </template>
    </el-table-column>
  </el-table>
  <div class="footer-div">
    <pagination  :total="ruleListTotal"  @pagination="handleLinkSuccess" :page.sync="pageInfo.pageNum" :limit.sync="pageInfo.pageSize"/>
  </div>
</el-card>

<!--重检制度列表-->
<link-dislog ref="linkRef" :show.sync="linkDialog" :link-type="linkType"  @handleLinkSuccess="handleLinkSuccess" />



/*重检制度start*/
linkDialog: false,
linkType: '',
ruleList: [],
ruleListTotal:0,//关联制度总数
pageInfo:{
pageNum: 1,
pageSize: this.$store.state.config.pageSize
},
/*重检制度end*/

//弹出未关联的制度
handleLinkedData(type) {
this.linkType = type
this.linkDialog = true
this.$nextTick(() => {
this.$refs.linkRef.linkedData(this.planid)
})
},
// 关联成功后查询关联数据
handleLinkSuccess(data) {
let params = {}
if(this.dialogType === 'add') {
params = {
planid: this.planid,
ruletype: data.type,
pageNum: this.pageInfo.pageNum,
pageSize:this.pageInfo.pageSize
}
}else {
params = {
planid: this.form.planid,
ruletype: data.type,
pageNum: this.pageInfo.pageNum,
pageSize:this.pageInfo.pageSize
}
}
console.log(params)
getRuleInnerList(this.queryParams,params).then(res => {
this.ruleList = res.rows
this.ruleListTotal=res.total
})
},
// 取消关联
handleDeleteLink(val,row) {
let data = {}
if(this.dialogType === 'add') {
data = {
planid: this.planid,
ruletype: val,
ruleid: row.ruleid
}
}else {
data = {
planid: this.form.planid,
ruletype: val,
ruleid: row.ruleid
}
}
deleteT21RuleRecheckMp(data).then(res => {
if(res.code === 200) {
this.msgSuccess('取消关联！')
this.handleLinkSuccess({ruletype: val,planid: this.form.planid})
}
})
},

/*制度重检end */


/**********************************************详情页面嵌套列表end****************************************************************************/
